window.roomNumber = new URLSearchParams(window.location.search).get('roomNumber');

var socket = io.connect('http://localhost:3000?groupid=' + roomNumber);

socket.on('connect', function () {
    console.log('客户端和服务端建立连接了');
});

// startGame
socket.on('start__game__to__client', function (data) {
    var userMsg = JSON.parse(data);

    // 底牌
    for (var i = 0; i < userMsg.playersMsg.length; i++) {
        if (userMsg.playersMsg[i].id == document.getElementsByClassName('status--1')[0].id) {
            window.theFlop = userMsg.playersMsg[i].theFlop
            renderTheFlop()
        }
    }

    // if (userMsg.playersMsg[0].theFlop.length > 0) {
    //     playerNumber > 8 ? true : window.theFlop = userMsg.playersMsg[0].theFlop;
    //     // console.log(window)
    //     playerNumber > 8 ? true : renderTheFlop();
    // }

    // 公共牌
    // if (userMsg.communityCardPoker.length > 0) {
    //     window.communityCardPoker = userMsg.communityCardPoker;
    //     renderCommunityCardPoker()
    // }

    // 游戏是否开始
    window.isStart = userMsg.isStart;

    // 玩家数据（去拿isTrun）
    window.playersMsg = userMsg.playersMsg
    console.log(window.playersMsg)

    // 调整位置，保证玩家在下面
    setLocation()
});
// function submitReady(){
//     if (isStart) return
//
//     socket.emit('player__ready', {
//         roomNumber: new URLSearchParams(window.location.search).get('roomNumber')
//     });
// }
function submitStartGame() {
    console.log(new URLSearchParams(window.location.search).get('roomNumber'))
    socket.emit('start__game__to__server', {
        roomNumber: new URLSearchParams(window.location.search).get('roomNumber')
    });
}



// setState
socket.on('set__state__to__client', function (data) {
    // 得到istrun
    playersMsg = JSON.parse(data).playersMsg;

    // 调整位置，保证玩家在下面
    setLocation()

    // 设置基本状态
    setState(
        document.getElementById(JSON.parse(data).id).classList[1],
        JSON.parse(data).style,
        JSON.parse(data).number
    )

    // //设置下一位为10秒倒计时
    // if (JSON.parse(data).style === 'status__info--fold' &&
    //     playersMsg[0].isTrun) return
    // var number = Number(
    //     document.getElementById(JSON.parse(data).id).classList[1].substring(8, 9)
    // ) + 1;
    // if (number > playersMsg.length) {
    //     number = 1
    // }
    // setState('status--' + (number), 'status__info--countdown')

});
function submitBuyin(number) {
    //下面这个console.log做一个弹窗提示
    console.log('带入成功，后手将在下一手牌更新')
    socket.emit('buyIn',
        {
            roomNumber: new URLSearchParams(window.location.search).get('roomNumber'), // 房间号
            id: document.getElementsByClassName('status--1')[0].id,
            number: number,
        });
}
function submitLeave() {
    console.log('玩家离开游戏')
    socket.emit('leave',
        {
            roomNumber: new URLSearchParams(window.location.search).get('roomNumber'), // 房间号
            id: document.getElementsByClassName('status--1')[0].id,
        });
    socket.emit('set__state__to__server',
        {
            roomNumber: new URLSearchParams(window.location.search).get('roomNumber'), // 房间号
            id: document.getElementsByClassName('status--1')[0].id,
            style: 'status__info--fold',
        });
}
function submitSetState(style, multiple) {
    console.log('触发' + style)
    console.log('----------')

    document.getElementsByClassName('my__items--raise')[0].style.display = 'none';

    if (!isStart) return;

    //css设置 style="pointer-events:none"禁止点击

    // if (!playersMsg[0].isTrun && style !== 'status__info--fold' ||
    //     playersMsg[0].isFlod) {
    //     return
    // }
    if (!playersMsg[0].isTrun && style !== 'status__info--fold' ||
        playersMsg[0].isFold) {
        return
    }
    if (!playersMsg[0].isTrun && style == 'status__info--fold') {
        preFold = 0 //此时为提前弃牌，不改变istrun
    } else {
        preFold = 1
    }
    var number = 0;
    // 这个底注和金额需要弄到服务器上，不然重连看不到

    // 过牌或者跟注
    if (style === 'status__info--call') {
        number = nowAnte;
    }
    // 加注
    else if (style === 'status__info--raise') {
        if (nowAnte == 0) {
            nowAnte = Number(pot) * Number(multiple);
            number = nowAnte;
        }
        else {
            nowAnte = Number(nowAnte) * Number(multiple) + Number(nowAnte);
            number = nowAnte;
        }
    }
    // all in
    if (style === 'status__info--all-in') {
        number = Number(document.getElementsByClassName('status__chips--Leftover')[8].innerHTML)
    }
    socket.emit('set__state__to__server',
        {
            roomNumber: new URLSearchParams(window.location.search).get('roomNumber'), // 房间号
            id: document.getElementsByClassName('status--1')[0].id,
            style: style,
            number: number,
            preFold: preFold,
        });
}

//  chat
socket.on('chat__to__client', function (data) {
    document.getElementsByClassName('chat__items')[0].innerHTML =
        document.getElementsByClassName('chat__items')[0].innerHTML +
        `
            <li class="chat__item">
                <p class="chat__paragraph">${JSON.parse(data).name}</p>
                <span class="chat__text">${JSON.parse(data).content}</span>
                <img class="chat__avatar" src="${JSON.parse(data).avatar}" alt="">
            </li>
        `

    document.getElementById(JSON.parse(data).id).getElementsByClassName('status__chat')[0].style.display = 'inline-block';
    document.getElementById(JSON.parse(data).id).getElementsByClassName('status__chat')[0].innerHTML = JSON.parse(data).content

    setTimeout(() => {
        document.getElementById(JSON.parse(data).id).getElementsByClassName('status__chat')[0].style.display = 'none';
    }, 10000);
});

function fn(callback) {
    fn.prototype.init(callback);
}
fn.prototype = {
    canclick: true,
    init: function (callback) {
        if (this.canclick) {
            this.canclick = false
            callback();
            setTimeout(function () {
                this.canclick = true
            }.bind(this), 10000)
        } else {
            window.alert('10秒只能发送一条消息')
        }
    }
}

function submitChat() {
    // 这个地方不要用http请求代替，因为后续可能会使用socket.id
    // if(document.getElementsByClassName('chat__input')[0].value  === '') {
    //     console.log('不能为空')
    //     return
    // };
    fn(function () {
        socket.emit('chat__to__server',
            {
                id: document.getElementsByClassName('status--1')[0].id,
                name: document.getElementsByClassName('status--1')[0].getElementsByClassName('status__name')[0].innerHTML,
                content: document.getElementsByClassName('chat__input')[0].value,
                avatar: document.getElementsByClassName('status--1')[0].getElementsByClassName('status__avatar')[0].src,
                // roomNumber: new URLSearchParams(window.location.search).get('roomNumber'), // 房间号
            });
    });


}
socket.on('win', function (data) {
    //结束信息，做一个弹窗提示
    console.log(data.name + '通过' + data.hand + '赢得底池' + data.pot)
});
socket.on('cooldownfold', function (data) {
    if (document.getElementsByClassName('status--1')[0].id == data) {
        submitSetState('status__info--fold')
    }
});
socket.on('callInsurance', function (data) {
    console.log('当前赢家' + data.winner + '补牌：' + data.outs + '投保额度：' + data.invest / data.odds)
    for (let i = 0; i < data.winner.length; i++) {
        console.log(document.getElementsByClassName('status--1')[0].name)

        //这里怎么读取玩家name?以下信息和按钮只发送给data.winner的玩家
        if (data.winner[i] == document.getElementsByClassName('status--1')[0].name) {
            console.log('补牌为：' + data.outs)
            console.log('投保额度' + data.invest / data.odds + '赔付金额' + data.invest + '是否投保?')
            //buy=0/1
            //buyInsurance(data.invest/data.odds,data.invest,buy)
            //这里做一个弹窗提示，并放两个按钮，绑定function buyInsurance 注意只对满足name=data.winner的玩家弹窗
        }
        break
    }
});
function buyInsurance(number, invest, outs, buy) {
    socket.emit('Insurance',
        {
            roomNumber: new URLSearchParams(window.location.search).get('roomNumber'), // 房间号
            id: document.getElementsByClassName('status--1')[0].id,
            number: number,
            conpensation: invest,
            outs: outs,
            buy: buy,
        });
}

// get__msg
socket.on('get__msg__to__client', function (data) {
    // var myMsg = JSON.parse(localStorage.getItem("myMsg"));
    var userMsg = JSON.parse(data);

    // 房间号
    window.roomNumber = userMsg.roomNumber;

    // 底注
    window.ante = userMsg.ante;

    // 当前底注
    window.nowAnte = userMsg.nowAnte;

    // 奖池
    window.pot = userMsg.pot;

    // 游戏是否开始
    window.isStart = userMsg.isStart;

    // 玩家在服务器里的号数。根据这个调整位置, 玩家为0-8，观战玩家为9以上。
    // 保存本地的方式，不能在同一个浏览器多开
    window.playerNumber = userMsg.playersMsg.findIndex(array => array.name === new URLSearchParams(window.location.search).get('name'));
    // window.playerNumber = userMsg.playersMsg.findIndex(array => array.name === myMsg.name);
    // window.playerNumber = 60; // 观战模式测试

    // 玩家数据[9个]
    window.playersMsg = userMsg.playersMsg

    // 调整位置，保证玩家在下面
    setLocation()

    // 设置观战玩家
    playerNumber > 9 ? setSpectatorMode() : false;

    // 开始前渲染
    renderBeforeStarting()

    // 每局开始渲染
    renderEveryRound()

    //底牌
    // if (userMsg.playersMsg[0].theFlop.length > 0) {
    //     playerNumber > 8 ? true : window.theFlop = userMsg.playersMsg[0].theFlop;
    //     playerNumber > 8 ? true : renderTheFlop();
    // }

    // 公共牌
    if (userMsg.communityCardPoker.length > 0) {
        window.communityCardPoker = userMsg.communityCardPoker;
        renderCommunityCardPoker()
    }

});




// 替代window.onload
function initCalculator() {
    if (document.documentElement.dataset['calcLoaded'] === 'true') return;
    // 获取数据
    socket.emit('get__msg__to__server',
        {
            roomNumber: new URLSearchParams(window.location.search).get('roomNumber')
        });

    document.documentElement.dataset['calcLoaded'] = 'true';
}

if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', initCalculator);
}
else if (document.readyState === 'interactive' || document.readyState === 'complete') {
    initCalculator();
}


/************************************* 游戏运行后获取 ************************************/
